<template>
	<view class="page">
		<template v-if="isLogin">
			<view class="body">
				<view class="env-params">
					<image class="bg-img" src="@/static/images/public_addinfo.png" mode="widthFix">
						<view class="contain">
							<view class="hd-title">环境数据</view>
							<view class="data-list ">
								<view class="item">
									<view class="label">经度</view>
									<text class="val">{{'--'}}</text>
								</view>
								<view class="item">
									<view class="label">纬度</view>
									<text class="val">{{'--'}}</text>
								</view>
								<!-- <view class="item">
							<view class="label">精度</view>
							<text class="val">{{params.accuracy|toFixedN(2)||'--'}} m</text>
						</view> -->
								<view class="item">
									<view class="label">海拔</view>
									<text class="val">{{'--'}}m</text>
								</view>
								<view class="item">
									<view class="label">天气情况</view>
									<text class="val">{{'--'}}</text>
								</view>
								<view class="item">
									<view class="label">空气温度</view>
									<text class="val">{{'--'}}°c</text>
								</view>
								<view class="item">
									<view class="label">空气湿度</view>
									<text class="val">{{'--'}}%</text>
								</view>
							</view>

							<view class="local-area">
								<view class="icon iconfont icon-daohang f-s40">&#xe648;</view>
								<view class="text">{{'广州市天河区'}}</view>
							</view>
						</view>
				</view>




			</view>
		</template>

	</view>
</template>

<script>
	import loading from '@/components/loading-more.vue'
	import empty from '@/components/empty.vue'
	import { HTTP_REQUEST_URL } from '@/config.js'
	import {
		previewImage
	} from '@/common/util.js'
	export default {
		name: 'demo',
		data() {
			return {
				isLogin: false,
				userInfo: uni.getStorageSync('userInfo'),
				loadingState: {
					default: true,
					loading: false,
					completed: false
				},
				id: ''
			}
		},
		onShow() {

		},
		onReachBottom() {},
		async onLoad(params) {

			this.isLogin = await this.$loginState('check');
			if (this.isLogin) {
				this.id = params.id;
				this.getDevInfo();
			}

		},
		methods: {

			// 预览结果图片
			previewPic: function(path) {
				let _this = this;
				previewImage({
					data: ['https://shibie.honghuoyi.com/image/sb-image.do?path=' + path],
					index: 0
				})
			},

			async getDevInfo() {
				let res = await this.$api.znjc_api.deviceinfo({
					id: this.id
				})
				console.log('devInfo', res);
				if (res.data.ret == 0) {

				}
			}

		},
		computed: {

		},
		watch: {

		},
		components: {
			loading,
			empty
		}
	}
</script>

<style scoped lang="less">
	.env-params {
		position: relative;

		.contain {
			position: absolute;
			left: 0;
			top: 0;
			width: 100%;
			height: 100%;
		}

		.hd-title {
			margin: 80rpx 20rpx 10rpx;
			padding-left: 20rpx;
			border-left: 10rpx solid #f8a53f;
			font-size: 32rpx;
			font-weight: bold;
			color: #fff;
		}
	}

	.data-list {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		width: 94%;
		margin: 0 auto 10rpx;

		.item {
			width: 33%;
			margin-top: 30rpx;
			font-size: 28rpx;
			text-align: center;
			color: #fff;

			.label {
				margin-bottom: 10rpx;
				color: #fff;
			}
		}
	}

	.local-area {
		display: flex;
		width: 85%;
		margin: 50rpx auto;
		background: #f2a6b2;
		border-radius: 8rpx;

		.icon {
			flex-shrink: 0;
			width: 70rpx;
			height: 80rpx;
			text-align: center;
			line-height: 80rpx;
			color: #fff;
		}

		.text {
			padding: 15rpx 0 15rpx 0;
			color: #fff;
			font-size: 30rpx;
		}
	}
</style>